<%@page contentType="text/html;charset=UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<%@ include file="/include/taglibs.jsp"%>
<%@ include file="/include/meta.jsp"%>
<script type="text/javascript">
	function addVar() {
		var idNum;
		var row1;
		row1 = $('#vars .var:last');//获得最后一行 -- 设置jquery对象(待克隆的div)
		//如果row1为空
		if (row1.length == 0) {
			idNum = 1;
			row1 = $("#var_" + (idNum - 1));
		} else {
			idNum = Number(row1.attr('id').split('_')[row1.attr('id')
					.split('_').length - 1]) + 1;
		}
		var newRow = row1.clone(true); //创建最后一行的一个副本
		// newRow.insertBefore(row1);	//在最后一行前插入
		newRow.insertAfter(row1); //在最后一行后插入	

		var nVarID = 'var_' + idNum;
		var nVarWheres = nVarID + '_Where';
		var nVarWhereBtn = nVarWheres + "Btn";
		var nVarWherePre = nVarID + '_Where';
		
		//var _prevVarWhere=row1.id+ '_Where';

		//var rndID = "varWhere" + idNum;
		var rndID = nVarWherePre;

		newRow.attr("id", nVarID); //设置行ID 每次都不一样 
		newRow.find('input[name="varWhereBtn"]').attr("id", nVarWhereBtn); //设置行ID 每次都不一样 
		newRow.find('div[name="varWheres"]').attr("id", nVarWheres); //设置行ID 每次都不一样 
		//给各个 select input 加上不同的id

		$.each(newRow.find("div[name='varWhere']"), function(index, obj) {
			$(obj).attr('id', nVarWherePre + '_' + index);
		});

		$.each(newRow.find("select.tabNamesSelect"), function(index, obj) {
			$(obj).attr('id', nVarWherePre + '_Tab_' + index);
		});

		$.each(newRow.find("select.colNamesSelect"), function(index, obj) {
			$(obj).attr('id', rndID + '_Col_' + index);
		});

		$.each(newRow.find("select.relationsSelect"), function(index, obj) {
			$(obj).attr('id', rndID + '_Op_' + index);
		});

		$.each(newRow.find("input.colLimit"), function(index, obj) {
			$(obj).attr('id', rndID + '_Val_' + index);
		});

		$.each(newRow.find("a[name='delWhere']"), function(index, obj) {
			$(obj).attr('id', rndID + '_Del_' + index);
		});

		newRow.find("a[name='delVar']").attr("id", nVarID);

		newRow.find("input[name='varDesc']").attr('id', 'varDesc' + idNum);
		newRow.find("input[name='varName']").attr('id', 'varName' + idNum);
		newRow.find("select.valFunsSelect").attr('id', 'varFun' + idNum);

		//拷贝设值
		$.each(newRow.find("select.tabNamesSelect"), function(index, obj) {
			$(obj).val($(row1.find("select.tabNamesSelect")[index]).val());
		});

		$.each(newRow.find("select.colNamesSelect"), function(index, obj) {
			$(obj).val($(row1.find("select.colNamesSelect")[index]).val());
		});

		$.each(newRow.find("select.relationsSelect"), function(index, obj) {
			$(obj).val($(row1.find("select.relationsSelect")[index]).val());
		});
		
		//初始值为空

		//注册事件
		newRow.find("a[name='delVar']").click(function() {
			delRow(this);
		});
		// 新加行显示删除按键
		newRow.find("a[name='delVar']").html(
				" <span style='color: blue;'>删除</span>");
		//显示克隆出的新行数据
		newRow.show();
	}

	function delVar(me) {
		$("#" + me.id).remove();
	}

	//动态添加行
	function addRow(me) {
		var idNum;
		var row1;
		var pre = me.id.replace('Btn', '');
		row1 = $('#' + pre + ' div:last');//获得最后一行 -- 设置jquery对象(待克隆的div)
		//如果row1为空
		if (row1.length == 0) {
			idNum = 1;
			row1 = $('#' + pre + "_" + (idNum - 1));
		} else {
			idNum = Number(row1.attr('id').split('_')[row1.attr('id')
					.split('_').length - 1]) + 1;
		}
		var newRow = row1.clone(true); //创建最后一行的一个副本
		// newRow.insertBefore(row1);	//在最后一行前插入
		newRow.insertAfter(row1); //在最后一行后插入	  
		var rndID = pre;
		newRow.attr("id", pre + "_" + idNum); //设置行ID 每次都不一样 

		//给各个 select input 加上不同的id
		newRow.find("select.tabNamesSelect").attr('id', pre + '_Tab_' + idNum);
		newRow.find("select.colNamesSelect").attr('id', pre + '_Col_' + idNum);
		newRow.find("select.relationsSelect").attr('id', pre + '_Op_' + idNum);
		newRow.find("input.colLimit").attr('id', pre + '_Val_' + idNum);
		newRow.find("a").attr('id', pre + '_Del_' + idNum);

		//设置选中
		newRow.find("select.tabNamesSelect").val(row1.find("select.tabNamesSelect").val());
		newRow.find("select.colNamesSelect").val(row1.find("select.colNamesSelect").val());
		newRow.find("select.relationsSelect").val(row1.find("select.relationsSelect").val());
		//初始值为空

		//给新增的每一行内的删除加上删除事件
		newRow.find("a").click(function() {
			delRow(this);
		});
		// 新加行显示删除按键
		newRow.find("a").html(" <span style='color: blue;'>删除</span>");
		//显示克隆出的新行数据
		newRow.show();
	}

	//动态删除行
	function delRow(who) {
		$("#" + who.id.replace('_Del', '')).remove();
	}

	function initWhereTab(who) {
		var doroodo_db={sy_module:'syModule',cx_sb_line:'cxSbLine',sy_tablefield_remarks:'syTablefieldRemarks',sy_webmodal:'syWebmodal',t_sb_primitive:'tsbPrimitive',v_cx_sb_balance_device:'vcxSbBalanceDevice',v_cx_sb_take_state:'vcxSbTakeState',sy_project:'syProject',t_sb_state_data:'tsbStateData',v_cx_sb_balance_data_location:'vcxSbBalanceDataLocation',sy_demo_gridtochart:'syDemoGridtochart',cx_sb_balance_device:'cxSbBalanceDevice',sy_parameter:'syParameter',cx_sb_point:'cxSbPoint',v_cx_sb_read_status_monitor:'vcxSbReadStatusMonitor',cx_sb_test:'cxSbTest',v_cx_sb_take_state_id:'vcxSbTakeStateId',v_take:'vtake',cx_sb_voltage:'cxSbVoltage',cx_sb_state_data:'cxSbStateData',sy_organ:'syOrgan',sy_file:'syFile',t_sb_project_page:'tsbProjectPage',cx_sb_company:'cxSbCompany',cx_sb_current:'cxSbCurrent',cx_sb_fault:'cxSbFault',sy_debug:'syDebug',cx_sb_take_state:'cxSbTakeState',v_cx_sb_balance_data:'vcxSbBalanceData',v_cx_sb_read_status_id:'vcxSbReadStatusId',sy_debug_state:'syDebugState',sy_chart:'syChart',sy_role:'syRole',t_sb_eq:'tsbEq',sy_user:'syUser',v_cx_sb_balance_data_standard:'vcxSbBalanceDataStandard',cx_sb_leakage_current:'cxSbLeakageCurrent',t_sb_project:'tsbProject',sy_demo_treeiframe:'syDemoTreeiframe',cx_sb_terminal_config:'cxSbTerminalConfig',v_cx_sb_terminal:'vcxSbTerminal',sy_parameter_used:'syParameterUsed',cx_sb_read_status:'cxSbReadStatus',sy_assembly:'syAssembly',v_cx_sb_take_state_monitor:'vcxSbTakeStateMonitor',sy_log:'syLog',sy_design:'syDesign',sy_demo_datetree:'syDemoDatetree',cx_sb_alarm_state:'cxSbAlarmState',sy_notice:'syNotice',v_cx_sb_read_status:'vcxSbReadStatus',cx_sb_terminal:'cxSbTerminal',cx_sb_sysdomian:'cxSbSysdomian'}
		var index=0;
		var _op="";
		$.each(doroodo_db, function(tab, obj) {
			if(tab.indexOf('cx_sb')>=0){
			if(index==0){
				_op+='<option selected="selected" value="'+tab+'">'+tab+'</option>';
			}else
			{_op+='<option value="'+tab+'">'+tab+'</option>';}
			index++;}
		});
		$(who).html(_op);
	}

	
	function initWhereCol(tab, who){
		data('${ctx}/sys/syDb_Get_TableUrl?tableId='+ tab, null, 'json', function(d){
			var _op="";
			if(d){
				d["treedata"];
				$.each(d["treedata"], function(index, obj) {
					if(index==0){
						_op+='<option selected="selected" value="'+obj["text"]+'">'+obj["text"]+'</option>';
					}else
					{_op+='<option value="'+obj["text"]+'">'+obj["text"]+'</option>';}
				});
				
			}else{
				log('加载失败');
			}
			$(who).html(_op);
		});
		
	}
	
	function getVarStr(varId){
		
	}

	function changeLoadCol(me) {
		initWhereCol($(me).val(),$("#"+me.id.replace('Tab','Col')));
		
	}
	$(function(){
		initWhereTab($("#TabNames"));
		initWhereCol($("#TabNames").val(),$("#ColNames"));
	});
</script>

</head>
<body class="easyui-layout">

	<div data-options="region:'north',title:'变量设计',split:true"
		style="height: 420px; padding: 5px;">
		<div id="vars">
			<div id="var_0" class='var'>
				<fieldset style="width: 625px;">
					<legend>定义变量</legend>
					<div>
						变量描述:<input type="text" name="varDesc"></input> 变量名:<input
							type="text" name="varName"></input>
					</div>
					变量条件:<input type="button" value="添加条件"
						onclick="return addRow(this);" id="varWhereBtn" name="varWhereBtn">
					<div class="conditionDiv" id="varWhere" name="varWheres"
						style="margin-left: 52px;">
						<div id="varWhere_0" name="varWhere">
							<select id="TabNames" name="tabNames[]" class="tabNamesSelect"
								onchange="changeLoadCol(this)" style="width: 100px;">
							</select> <select id="ColNames" name="colNames[]" class="colNamesSelect"
								style="width: 100px;">
							</select> <select id="relations" name="relations[]"
								class="relationsSelect"
								style="width: 80px; margin: 0px 0px 0px 10px;">
								<option value="= ">等于</option>
								<option value="like">类似</option>
								<option value=">=">大于等于</option>
								<option value="<=">小于等于</option>
								<option value="> ">大于</option>
								<option value="< ">小于</option>
							</select> <input id="colLimit" name="colLimit[]" class="colLimit"
								style="width: 100px; margin: 0px 0px 0px 20px;" /> <a href="#"
								id="delWhere" name="delWhere" onclick="return false;" title="删除"
								class="delRow_Link"></a>
						</div>
					</div>
					取值计算:<select id="valFuns" name="valFuns[]" class="valFunsSelect"
						style="width: 100px; margin: 0px 0px 0px 0px;">
						<option value="val">第一个元素值</option>
						<option value="max">最大值</option>
						<option value="min">最小值</option>
						<option value="avg">平均值</option>
						<option value="sum">和</option>
						<option value="count">统计数</option>
					</select>
				</fieldset>
				<a href="#" id="delVar" onclick="return false;" name="delVar"
					title="删除" class="delRow_Link"></a>

			</div>

		</div>
		<input type="button" value="添加变量" onclick="return addVar();">
	</div>

	<div data-options="region:'center',title:'公式编辑'" style="padding: 5px;"
		class="easyui-layout">
		<div data-options="region:'west',title:'输入公式'"
			style="padding: 5px; width: 350px;">
			<input class="easyui-textbox" name="formula" placeholder="公式要求对val赋值,格式为：[val=a+b;],其中a、b分别是定义的变量名"
				data-options="multiline:true" style="height: 70%; width: 95%" /> <input
				type="button" value="校验公式" onclick="alert('校验')"> <input
				type="button" value="预览脚本" onclick="alert('校验')"> <input
				type="button" value="保存脚本" onclick="alert('校验')">
		</div>
		<div data-options="region:'center',title:'公式脚本'"
			style="padding: 5px; width: 450px;">
			<input class="easyui-textbox" name="formula"
				data-options="multiline:true" style="height: 95%; width: 95%" />
		</div>
	</div>
</body>
</html>